<template>
  <div class="school">
    <!-- 组件的结构 -->
     <h2>学校名称：{{schoolName}}</h2>
     <h2>学校地址：{{ address }}</h2>
     <button @click="showInfo">点我提示学校信息</button>
  </div>
</template>

<script>
// 组件的交互代码
export default {
  name: 'School',
  data() {
    return {
      schoolName: '尚硅谷',
      address: '北京'
    }
  },
  methods: {
    showInfo() {
      alert('学校信息')
    }
  }
}
  
</script>

<style>
  /* 组件的样式 */
  .school {
    background-color: pink;
  }
</style>